<!DOCTYPE HTML>
<html lang="en">
	<head>

		<title>Trace</title>

		<meta charset="utf-8">
		<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="theme-color" content="#c6838f" />

		<link rel="stylesheet" type="text/css" href="../css/options.css" media="all" />
		<link rel="stylesheet" type="text/css" href="../css/simple.css" media="all" />
		<link rel="stylesheet" type="text/css" href="../css/themedata.css" media="all" />

	</head>
	<body>

		<!--
			Trace Version 3.0.5
			By Jake Mcneill

			Website:	https://absolutedouble.co.uk/
			Github:		https://github.com/jake-cryptic/
			Changelog: 	https://absolutedouble.co.uk/trace/information.html

			Copyright AbsoluteDouble Trace 2018 - 2020
		-->

		<script src="../js/common/theme.js"></script>

		<div id="overlay_message">
			<div id="overlay_cont">
				<span id="overlay_close">&times;</span>
				<div id="drop_message">
					<h1>Thanks for installing Trace!</h1>
					<div class="bigtext">
						You are now being protected against many advanced online fingerprinting techniques which makes you harder to track around the web. Not all of
						Trace's settings are enabled though, I encourage you to explore the UI and look at all of the features Trace has to offer.
						<br /><br />
						By default, Trace is set to preset mode, however if you you would like a much greater level of control you can use the "Advanced" UI.
						If you choose to switch, you can always change back. <a id="sw_adv_ui" href="#" class="dark">Click here to switch to Trace's Advanced UI.</a>
						<br /><br />
						Please report any bugs to me via email or via Telegram.<br />
						<a href="https://github.com/jake-cryptic/AbsoluteDoubleTrace/" title="GitHub Source" class="dark">Source Code</a> |
						<a href="https://absolutedouble.co.uk/trace/information.html" title="Change log" class="dark">Changelog</a> |
						<a href="https://absolutedouble.co.uk/trace/faq.html" title="FAQ" class="dark">Frequently Asked Questions</a> |
						<a href="https://t.me/trace_extension" title="Trace Telegram Channel" class="dark">Telegram Channel</a>
					</div>
				</div>
			</div>
		</div>

		<div id="e_msg" class="hidden">
			<h2>Trace failed to load</h2>
			<p id="fail_reason">Unknown.</p>
		</div>

		<div id="ux" class="blurred">
			<nav id="main_nav"></nav>
			<main id="simple">
				<section id="protection" class="view">
					<div class="sect_headers">
						<h1 class="sect_title" id="protection_title"></h1>
						<h2 class="sect_subtitle" id="protection_subtitle"></h2>
					</div>
					<div class="protection_cards">
						<div class="protection_card card_optional" id="prot_disabled" data-card="pause"></div>
						<div class="protection_card card_optional" id="prot_web" data-card="web"></div>
						<div class="protection_card card_optional" id="prot_premium" data-card="premium"></div>
					</div>

					<div class="sect_headers">
						<h1 class="sect_title" id="presets_title"></h1>
						<h2 class="sect_subtitle" id="presets_subtitle"></h2>
					</div>
					<div class="protection_cards">
						<div class="protection_card enable_hover_cursor card_standard" id="prot_low" data-card="low"></div>
						<div class="protection_card enable_hover_cursor card_active" id="prot_med" data-card="medium"></div>
						<div class="protection_card enable_hover_cursor card_standard" id="prot_high" data-card="high"></div>
						<div class="protection_card enable_hover_cursor card_standard" id="prot_extreme" data-card="extreme"></div>
						<div class="protection_card enable_hover_cursor card_standard" id="prot_custom" data-card="custom"></div>
					</div>
				</section>
				<section id="sites" class="view hidden">
					<div class="sect_headers">
						<h1 class="sect_title" id="sitelist_title"></h1>
						<h2 class="sect_subtitle" id="sitelist_subtitle"></h2>
					</div>
					<div id="sites_search"></div>
					<div id="sites_list"></div>
				</section>
			</main>
		</div>

		<script src="../js/libraries/jquery.js"></script>
		<script src="../js/common/data.js"></script>
		<script src="../js/common/shared.js"></script>
		<script src="../js/common/ux.js"></script>
		<script src="../js/pages/settings.js" defer></script>

	</body>
</html>